iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 3
0
Mobile Development

傻瓜也要能看懂的Flutter學習心得系列 第 3

[Day 3]安裝IDE,然後執行Flutter Doctor。

  • 分享至 

  • xImage
  •  

什麼是IDE?這個IDE不是指古老的硬碟介面(在SATA以前的一種硬碟介面),這個IDE叫做整合開發環境Integrated Development Environment。

這是什麼東西?

上一篇有講到:以前程式是在像小作家這類的文件編輯軟體上寫一份文件檔案後(文件的內容是程式碼),然後用各種語言下專屬的編譯器轉編譯成程式,而編譯器大多是用終端機模式操作,所以要使用編譯器必須要啟動終端機模式。

聽起來沒什麼。但我上一篇把這整件事情的難度嚴重簡化了。

今天有視窗作業系統,大家要離開小作家、進入終端機模式,只要找「把視窗縮小」「把終端機模式(預先啟動後)叫起來」即可。

但在沒有視窗系統的時代,像DOS系統上,大家做這件事情的正確流程應該是這樣...

在終端機模式上建立程式的檔案路徑(專屬的資料夾),然後啟動編輯軟體、在檔案路徑下新增一份檔案,寫完一部份程式碼後,關閉編輯軟體回到終端機模式,啟動編譯器、將程式碼文件編譯成程式,然後執行看測試結果!確認如果沒問題,就繼續完成下一階段功能,如果有問題就修改程式碼,無論如何,都要啟動編輯軟體、在檔案路徑下開啟剛才編輯的檔案,新增完、或修改完,關閉編輯軟體回到終端機模式,啟動編譯器、將程式碼文件編譯成程式,然後執行看測試結果!......重複這個過程直到程式完成為止。

不過,不是說視窗模式就是棒、終端模式就是差,因為看見了這樣的不方便,所以就有人想出一種程式,裡面集合了編輯程式碼的文書編輯功能、編譯器呼叫指令、甚至還有執行測試。

這種「將所有開發程式需要的工具軟體都集合在一支軟體內」的概念就是整合開發環境IDE:Integrated Development Environment。

但為什麼是整合開發「環境」?而不直接稱呼它為軟體?

這東西到底是什麼?這些名詞搞得我好亂、頭好痛啊!

軟體其實是種很粗獷的概念,它其實也包含了很多種形式,通通統稱為軟體並不適合。

比如手機平台上的APP其實結構跟運作方式和Windows上的軟體是有差異的。

而IDE既然稱為「環境」,可能是想表達:這裡面的絕大多數功能都是可以獨立在這支軟體外運作的東西。

像編譯器,它不需要IDE也一樣可以運作。

用來收集測試訊息的除錯器也一樣可以在IDE外運作。

這兩者結合在一個介面上後,開發者就不需要在終端機模式上切換,只要直接點擊視窗介面上的按鈕,就可以使用「編譯」「執行測試」等功能。

不負責任的說法:IDE就像是種程式開發的懶人工具

甚至這些功能甚至可以抽換。比如未來要用來編寫程式的Android Studio當初就不用設計用來寫Flutter,裡頭設置的編譯器最初並非Flutter編譯器。

還有些更誇張的例子,例如Eclipse,從Java、C++、Kotlin、PHP...幾乎無所不包。(但好不好用就是另一回事。)

所以來安裝Android Studio吧!...官方載點在這裡,下載完直接安裝就好。

比較奇妙的地方是:安裝完,需要執行Flutter Doctor。

因為Android Studio並不是預設使用Flutter作為程式語言的IDE,所以必須要修改它、擴充它,讓Android Studio知道要來取用Flutter的SDK。

如果要執行Flutter Doctor,這又要回到終端機模式,到昨天安裝Flutter的路徑下...什麼?還不會用終端機模式?

cd
cd\
cd [路徑名稱]

在終端機模式下,一定會歸屬在某個資料夾路徑內,例如「桌面下 C:\Desktop>」「使用者下 C:\Users>」「系統下 C:\Windows>」。(我不是Windows專家,我不敢給個鐵打不壞的答案。)

但重點是要怎麼從那個路徑去到你安裝Flutter的地方?

假設Flutter安裝(解壓縮)在「C:\Flutter」裡面,那首先要回到C硬碟根目錄下。

(注意!安裝Flutter並不一定要在終端機模式下完成,就算使用視窗模式的檔案管理員也可以。)

所謂的根目錄,應該就是說「檔案系統已經沒有得往上追尋了」。一台電腦可以有多個硬碟,有C、有D...但並沒有一個跟目錄可以讓你自由直接切換。有專門切換根目錄的指令。有機會再說(或補充)。

方法就是...

[鍵盤輸入]cd\ + [Enter]

注意,先輸入「cd\」,直接按「Enter」不管用。

然後就會回到「C:\ >」下。

這時候就可以切換進去Flutter的路徑內。

方法是...

[鍵盤輸入]cd\Flutter + [Enter]

有些人可以猜到用這種方式可以進去任何資料路境內。所以如果Flutter不是安裝在「C:\Flutter」裡面,例如「C:\Flutter」只要改過名稱,改為輸入...

[鍵盤輸入]cd\Flutter1 + [Enter]

使用Flutter Doctor的方式也很簡單,就輸入「flutter doctor」然後「Enter」,就可以了。

對了,Flutter Doctor程式會在終端機模式內問你一堆問題,基本上全都按Yes就好了。


上一篇
[Day 2] 先理解什麼是程式設計、編譯器、SDK
下一篇
[Day 4] 要開始動手寫程式了嗎?
系列文
傻瓜也要能看懂的Flutter學習心得10
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言